<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <title>分类表</title>
    <div th:replace="common/link::header"></div>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <!-- 左树 -->
        <div class="layui-col-sm12 layui-col-md3 layui-col-lg3">
            <div class="layui-card">
                <div class="layui-card-header layuiadmin-card-header-auto">
                </div>
                <form class="layui-form layui-form-pane">
                    <div style="width: 180px;margin: 50px auto;">
                        <select id="lineNameS" name="lineNameS" lay-filter="lineNameTest">
                        </select>
                        <a sec:authorize="hasAuthority('user:add')"  style="margin-right: 20px;float: right;" id="addSite"
                           class="layui-btn" lay-event="add">添加线路
                        </a>
                    </div>
                    <div style="width: 180px;margin: 50px auto;">
                        <select id="stationNameS" name="stationNameS" lay-filter="stationNameTest">
                        </select>
                    </div>
                    <div style="width: 180px;margin: 50px auto;">
                        <select id="locationS" name="locationS" lay-filter="locationTest">
                        </select>
                    </div>
                    <div style="margin: 20px 20px;">
                        <p>使用说明如下：</p>
                        <p>1.左边下拉列表框用来选择对应的线路名称，站点名称和位置信息，选择线路名称后右边会显示这个线路里的设备公共信息</p>
                        <hr>
                        <p>2.左边选择完成后，右上边是用来选择对应的阵列机型信息</p><hr>
                        <p>3.机型选择后鼠标单击可以看到对应的机型设备档案信息，鼠标放到图片上可以看到详细信息</p><hr>
                        <p>4.批量导入线路和批量导入设备有个模板可以进行大量数据的导入</p><hr>
                        <p>5.添加线路和添加设备详细信息是用来添加单个数据使用，参考图片可以查看当前设备档案信息的图片</p><hr>
                    </div>

                </form>
            </div>
        </div>
        <!-- 右表 -->
        <div class="layui-col-sm12 layui-col-md9 layui-col-lg9" >
            <div class="layui-card">
                <input type="hidden" name="lineNo" id="lineNo">
                <div class="layui-form-item">
                    <table id="userTable1" lay-filter="userTable1"></table>
                </div>
            </div>
            <div class="layui-card-body">
                <div style="float: left;width: 200px" class="left1">
                </div>
                <div style="float: right;width: 200px;" class="right1">
                </div>
                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                <div id="main" style="width: 900px;height:450px;"></div>
            </div>
            <div style="clear:both"></div>
            <div class="layui-btn-container">
                    <a style="float: right;" id="infoView1" class="layui-btn" lay-event="info">参考图片</a>
                <a sec:authorize="hasAuthority('user:add')"  style="margin-right: 20px;float: right;" id="addInfo"
                        class="layui-btn" lay-event="add">添加设备详细信息
                </a>
                <a sec:authorize="hasAuthority('user:add')"  style="margin-right: 20px;float: right;" id="addView"
                        class="layui-btn" lay-event="add">添加线路
                </a>
                <a sec:authorize="hasAuthority('user:add')"  style="margin-right: 20px;float: right;" id="importData2"
                        class="layui-btn" lay-event="add" onclick="importData2()">批量导入设备
                </a>
                <a sec:authorize="hasAuthority('user:add')"  style="margin-right: 20px;float: right;" id="importData"
                        class="layui-btn" lay-event="add" onclick="importData()">批量导入线路
                </a>
            </div>
        </div>
    </div>
</div>
<div th:replace="common/script::footer"></div>
<script th:inline="javascript">
    layui.config({
        base: '/static/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'useradmin', 'table', 'crud', 'upload'], function () {
        let $ = layui.$,
            form = layui.form,
            table = layui.table,
            upload = layui.upload,
            crud = layui.crud;
        // 查询列表接口
        table.render({
            elem: '#userTable1'
            , url: ctx + '/app/ad/tableTest'
            , contentType: 'application/json;charset=UTF-8'
            , method: "POST"
            , cols: [[ //表头
                {
                    field: 'type1',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign1',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass1', title: '通道', align: 'center', width: 130},
                {
                    field: 'type2',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign3',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass2', title: '通道', align: 'center', width: 130},
                {
                    field: 'type3',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign5',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass3', title: '通道', align: 'center', width: 130},
                {
                    field: 'type4',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign7',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass4', title: '通道', align: 'center', width: 130},
                {
                    field: 'type5',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign9',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass5', title: '通道', align: 'center', width: 130},
                {
                    field: 'type6',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign11',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass6', title: '通道', align: 'center', width: 130},
                {
                    field: 'type7',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign13',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass7', title: '通道', align: 'center', width: 130},
                {
                    field: 'type8',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign15',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },
                {field: 'pass8', title: '通道', align: 'center', width: 130},
                {
                    field: 'type9',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign17',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                },{field: 'pass9', title: '通道', align: 'center', width: 130},
                {
                    field: 'type10',
                    title: '机头',
                    align: 'center',
                    width: 58,
                    event: 'setSign19',
                    style: 'background-color: gainsboro;height: 140px;writing-mode: tb-rl;'
                }
            ]],
            done: function (res, curr, count) {
                $('th').css({
                    'background-color': '#009688', 'color': '#fff'
                });
            }
        });
        $(document).on('click', "#addView", function (obj) {
            active.addView();
        });
        $(document).on('click', "#addInfo", function (obj) {
            active.addView2();
        });
        $(document).on('click', "#addSite", function (obj) {
            active.addSite();
        });

        layui.upload.render({
            elem: "#importData",//导入id
            url: ctx + '/app/ad/importExcel',
            size: '3072',
            accept: "file",
            exts: 'xls|xlsx|xlsm|xlt|xltx|xltm',
            done: function (result) {
                layer.msg('导入成功');
                //获取第一个值
                $.ajax({
                    url: ctx + '/app/ad/pageTest',
                    type: 'get',
                    dataType: 'json',
                    success: function (data) {
                        let str1 = "<option value='0'>请选择线路名称</option>";
                        for (let i of data) {
                            str1 += `<option name="lineName" value='${i.lineName}'>${i.lineName}</option>`;
                        }
                        $("#lineNameS").html(str1);
                        form.render();
                    }, error: function () {
                        layer.msg('没有获取到数据');
                    }
                });
            },
            error: function () {
                layer.msg("导入失败");
            }
        });
        //批量导入设备2
        layui.upload.render({
            elem: "#importData2",//导入id
            url: ctx + '/app/ad/importExcel2',
            size: '3072',
            accept: "file",
            exts: 'xls|xlsx|xlsm|xlt|xltx|xltm',
            done: function (result) {
                layer.msg('导入成功');
                //执行重载2
                table.reload('userTable1');
                // form.render();
            },
            error: function () {
                layer.msg("导入失败");
            }
        });
        //文字提示
        function textTip(datas) {
            $(".left1").empty();
            $(".left1").append(
                '<p class="one"><b>①门翼：'+'</b>'+ datas[0].GPartNumber + datas[0].GPartName + '</p>' + '<hr>' +
                '<p class="two"><b>②机芯组件：'+'</b>' + datas[0].RPartNumber + datas[0].RPartName + '</p>' + '<hr>' +
                '<p class="three"><b>③驱动组件：'+'</b>'+ datas[0].MPartNumber + datas[0].MPartName + '</p>' + '<hr>' +
                '<p class="four"><b>④显示屏：'+'</b>'+ datas[0].DPartNumber + datas[0].DPartName + '</p>' + '<hr>' +
                '<p class="five"><b>⑤通行控制单元：'+'</b>' + datas[0].CPartNumber + datas[0].CPartName + '</p>' + '<hr>' +
                '<p class="six"><b>⑥备用电源：'+'</b>' + datas[0].EPartNumber + datas[0].EPartName + '</p>' + '<hr>' +
                '<p class="seven"><b>⑦光电发射组件：'+'</b>'+ datas[0].SPartNumber+ datas[0].SPartName + '</p>' + '<hr>'
            );
            $(".right1").empty();
            $(".right1").append(
                '<p class="eight"><b>⑧编码器：'+'</b>' + datas[0].CoPartNumber + datas[0].CoPartName + '</p>' + '<hr>' +
                '<p class="nine"><b>⑨工控机：'+'</b>'+ datas[0].IpcPartNumber +  datas[0].IpcPartName + '</p>' + '<hr>' +
                '<p class="ten"><b>⑩二维码识读：'+'</b>' + datas[0].QrPartNumber + datas[0].QrPartName + '</p>' + '<hr>' +
                '<p class="eleven"><b>⑪安全光幕发射1：'+'</b>' + datas[0].FPartNumber + datas[0].FPartName + '</p>' + '<hr>' +
                '<p class="twelve"><b>⑫旅行证件识读：'+'</b>'+ datas[0].TPartNumber + datas[0].TPartName + '</p>' + '<hr>' +
                '<p class="thirteen"><b>⑬电机驱动器：'+'</b>' + datas[0].MdPartNumber + datas[0].MdPartName + '</p>' + '<hr>' +
                '<p class="fourteen"><b>⑭测量光幕发射：'+'</b>' + datas[0].MlPartNumber + datas[0].MlPartName + '</p>' + '<hr>' +
                '<p class="fifteen"><b>⑮安全光幕发射1：'+'</b>' + datas[0].SlPartNumber + datas[0].SlPartName + '</p>' + '<hr>'+
                '<p class="sixteen"><b>⑯光电接收组件：'+'</b>' + datas[0].SlPartNumber + datas[0].SlPartName + '</p>' + '<hr>'+
                '<p class="seventeen"><b>⑰安全光幕发射2：'+'</b>' + datas[0].SlPartNumber + datas[0].SlPartName + '</p>' + '<hr>'+
                '<p class=eighteen"><b>⑱安全光幕发射2：'+'</b>' + datas[0].SlPartNumber + datas[0].SlPartName + '</p>' + '<hr>'+
                '<p class="nineteen"><b>⑲安全光幕接收1：'+'</b>' + datas[0].SlPartNumber + datas[0].SlPartName + '</p>' + '<hr>'+
                '<p class="seventeen"><b>⑳安全光幕接收2：'+'</b>' + datas[0].SlPartNumber + datas[0].SlPartName + '</p>' + '<hr>'+
                '<p class="fourteen"><b>㉑测量光幕接收：'+'</b>' + datas[0].MlPartNumber + datas[0].MlPartName + '</p>' + '<hr>'
            );
        }
        //绘制图表
        function paint(datas) {
            // 绘制图表。
            var myChart = echarts.init(document.getElementById('main'));
            myChart.clear();
            var option;//定义设置项
            //通过jqeury的get方法获取svg文件，并执行回调函数function (svg){}
            $.get('/static/1.svg', function (svg) {
                echarts.registerMap('Beef_cuts_France', {svg: svg});//注册地图
                option = {
                    title: {
                        text: '设备详细信息',
                        subtext: '序列号：' + datas[0].sNumber,
                        left: 'center'
                    },
                    //鼠标移动至svg元素上会弹出来的提示框
                    tooltip: {
                        //可以格式化其显示的内容，可以使用回调函数，详见说明文档
                        //formatter: '{b}: {c}<br />'
                        // 使用字符串模板，模板变量为刻度默认标签 {value}
                        //formatter: '{value}',
                        // 使用函数模板，函数参数分别为刻度数值（类目），刻度的索引
                        formatter: function (value, index) {
                            return value.data.value;
                        }
                    },
                    //对数据列的设置
                    series: [
                        {
                            name: 'French Beef Cuts',//数据列的名称
                            type: 'map',//数据列的类别
                            map: 'Beef_cuts_France',//数据列所要绑定的地图
                            //roam: true,//是否允许放大
                            label: {
                                show: false, //展示
                                position: 'outside' // outside表示文本显示位置为外部
                            },
                            emphasis: {
                                //文本样式
                                show: false, //展示
                                textStyle: {
                                    //文本样式
                                    fontSize: '14',
                                    fontWeight: '600'
                                }
                            },
                            labelLine: {
                                show: false, //展示
                                position: 'outside',
                                length: 50
                            },
                            //数据列的显示样式
                            itemStyle: {
                                color: 'Yellow',//颜色设置，在我使用的自己绘制的SVG图中，这个设置项可以对svg元素的填充色不起作用
                                borderColor: 'rgba(255,255,0,0.1)',//边框颜色设置
                                borderWidth: 2,//边框粗细设置
                                areaColor: 'rgba(255,0,0,0)',//区域颜色设置，在我使用的自己绘制的SVG图中，这个设置项可以对svg元素的填充色进行设置，前提是svg元素在绘制的时候填充颜色不透明度要大于0
                            },
                            //高亮显示的设置
                            emphasis: {
                                //高亮时的样式显示
                                itemStyle: {
                                    borderColor: 'Yellow',
                                    areaColor: 'rgba(255,0,0,0.5)',
                                    borderWidth: 2,
                                    borderType: 'solid'
                                }
                            },
                            selectedMode: false,//关闭选择模式，即图元为不可选择状态。开启时，同样可以对元素被选中后的样式等进行设置
                            // 以下为测试数据
                            //这里的name为svg文件中元素的name属性，很多svg编辑器绘制的svg文件是没有name属性的，必须得自己加上去。
                            data: [
                                {
                                    name: '门翼',
                                    value: '<b>'+"编码："+'</b>' + datas[0].GPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].GPartName
                                },
                                {
                                    name: '读写器',
                                    value: '<b>'+"编码："+'</b>' + datas[0].RPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].RPartName
                                },
                                {
                                    name: '磁模块',
                                    value: '<b>'+"编码："+'</b>' + datas[0].MPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].MPartName
                                },
                                {
                                    name: '显示屏',
                                    value: '<b>'+"编码："+'</b>' + datas[0].DPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].DPartName
                                },
                                {
                                    name: '通行控制单元',
                                    value: '<b>'+"编码："+'</b>' + datas[0].CPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].CPartName
                                },
                                {
                                    name: '备用电源',
                                    value: '<b>'+"编码："+'</b>' + datas[0].EPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].EPartName
                                },
                                {
                                    name: '数据存储卡',
                                    value: '<b>'+"编码："+'</b>' + datas[0].SPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].SPartName
                                },
                                {
                                    name: '编码器',
                                    value: '<b>'+"编码："+'</b>' + datas[0].CoPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].CoPartName
                                },
                                {
                                    name: '工控机',
                                    value: '<b>'+"编码："+'</b>' + datas[0].IpcPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].IpcPartName
                                },
                                {
                                    name: '二维码识读',
                                    value: '<b>'+"编码："+'</b>' + datas[0].QrPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].QrPartName
                                },
                                {
                                    name: '摄像头',
                                    value: '<b>'+"编码："+'</b>' + datas[0].FPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].FPartName
                                },
                                {
                                    name: '旅行证件识读',
                                    value: '<b>'+"编码："+'</b>' + datas[0].TPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].TPartName
                                },
                                {
                                    name: '电机驱动器',
                                    value: '<b>'+"编码："+'</b>' + datas[0].MdPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].MdPartName
                                },
                                {
                                    name: '测量光幕',
                                    value: '<b>'+"编码："+'</b>' + datas[0].MlPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].MlPartName
                                },
                                {
                                    name: '安全光幕',
                                    value: '<b>'+"编码："+'</b>' + datas[0].SlPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].SlPartName
                                },
                            ]
                        }
                    ]
                };
                myChart.setOption(option);
            });
            if (option && typeof option === 'object') {
                myChart.setOption(option);
            }
            window.addEventListener('resize', myChart.resize);
        }
        function exQuce(){
            var myChart = echarts.init(document.getElementById('main'));
            myChart.on("mouseover", function (params) {
                let name = params.name;
                if (name == "门翼") {
                    $(".one").css("color", "blue");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "读写器") {
                    $(".one").removeAttr("style");
                    $(".two").css("color", "blue");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "磁模块") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").css("color", "blue");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "显示屏") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").css("color", "blue");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "通行控制单元") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").css("color", "blue");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "备用电源") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").css("color", "blue");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "数据存储卡") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").css("color", "blue");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "编码器") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").css("color", "blue");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "工控机") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").css("color", "blue");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "二维码识读") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").css("color", "blue");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "摄像头") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").css("color", "blue");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "旅行证件识读") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").css("color", "blue");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "电机驱动器") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").css("color", "blue");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").removeAttr("style");
                } else if (name == "测量光幕") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").css("color", "blue");
                    $(".fifteen").removeAttr("style");
                } else if (name == "安全光幕") {
                    $(".one").removeAttr("style");
                    $(".two").removeAttr("style");
                    $(".three").removeAttr("style");
                    $(".four").removeAttr("style");
                    $(".five").removeAttr("style");
                    $(".six").removeAttr("style");
                    $(".seven").removeAttr("style");
                    $(".eight").removeAttr("style");
                    $(".nine").removeAttr("style");
                    $(".ten").removeAttr("style");
                    $(".eleven").removeAttr("style");
                    $(".twelve").removeAttr("style");
                    $(".thirteen").removeAttr("style");
                    $(".fourteen").removeAttr("style");
                    $(".fifteen").css("color", "blue");
                }
            })
            myChart.on("mouseout", function (params) {
                $(".one").removeAttr("style");
                $(".two").removeAttr("style");
                $(".three").removeAttr("style");
                $(".four").removeAttr("style");
                $(".five").removeAttr("style");
                $(".six").removeAttr("style");
                $(".seven").removeAttr("style");
                $(".eight").removeAttr("style");
                $(".nine").removeAttr("style");
                $(".ten").removeAttr("style");
                $(".eleven").removeAttr("style");
                $(".twelve").removeAttr("style");
                $(".thirteen").removeAttr("style");
                $(".fourteen").removeAttr("style");
                $(".fifteen").removeAttr("style");
            })
            $('.left1').empty();
            $('.right1').empty();
            var myChart = echarts.init(document.getElementById('main'));
            myChart.dispose();
            $("#infoView1").click(function (){
                layer.msg("暂无图片");
                $("#infoView1").unbind("click");
            })
        }

        //监听单元格事件
        table.on('tool(userTable1)', function (obj) {
            var data = obj.data;
            if (obj.event === 'setSign1') {
                if (data.type1 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type1Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0]!=null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type1Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign3') {
                if (data.type2 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type2Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0]!=null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type2Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign5') {
                if (data.type3 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type3Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0]!=null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type3Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign7') {
                if (data.type4 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type4Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0]!=null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type4Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign9') {
                if (data.type5 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type5Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0] != null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type5Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign11') {
                if (data.type6 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type6Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0] != null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type6Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign13') {
                if (data.type7 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type7Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0] != null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type7Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign15') {
                if (data.type8 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type8Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0]!=null) {
                                $("#infoView1").click(function (){
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            }else {
                                exQuce();
                                layer.msg("机头序列号："+data.type8Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign17') {
                if (data.type9 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type9Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0] != null) {
                                $("#infoView1").click(function () {
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            } else {
                                exQuce();
                                layer.msg("机头序列号："+data.type9Code+"暂无数据");
                            }
                        }
                    });
                }
            } else if (obj.event === 'setSign19') {
                if (data.type10 != undefined) {
                    $.ajax({
                        type: "post",
                        dataType: "JSON", traditional: true,
                        data: {
                            "sNumber": data.type10Code
                        },
                        url: ctx + '/app/ad/show',
                        contentType: 'application/x-www-form-urlencoded',
                        async: false,//表示同步执行
                        success: function (datas) {
                            if (datas[0] != null) {
                                $("#infoView1").click(function () {
                                    active.infoView(datas[0].id);
                                    $("#infoView1").unbind("click");
                                })
                                textTip(datas);
                                paint(datas);
                            } else {
                                exQuce();
                                layer.msg("机头序列号："+data.type10Code+"暂无数据");
                            }
                        }
                    });
                }
            }
            });

        //获取第一个值
        $.ajax({
            url: ctx + '/app/ad/pageTest',
            type: 'get',
            dataType: 'json',
            success: function (data) {
                let str1 = "<option value='0'>请选择线路名称</option>";
                for (let i of data) {
                    str1 += `<option name="lineName" value='${i.lineName}'>${i.lineName}</option>`;
                }
                $("#lineNameS").html(str1);
                form.render();
            }, error: function () {
                layer.msg('没有获取到数据');
            }
        });
        //下拉框1监听事件
        form.on('select(lineNameTest)', function (data) {
            if ($('#lineNameS option:checked').val() != 0) {
                $.ajax({
                    url: ctx + '/app/ad/pageTest2',
                    type: 'POST',
                    dataType: 'json',
                    data: JSON.stringify({
                        lineName: $('#lineNameS option:checked').text()
                    }),
                    contentType: 'application/json;charset=UTF-8',
                    success: function (data) {
                        let str2 = "<option value='0'>请选择站点名称</option>";
                        for (let i of data) {
                            str2 += `<option value='${i.stationName}'>${i.stationName}</option>`;
                        }
                        $("#stationNameS").html(str2);
                        $("#locationS").empty();
                        form.render();
                        $.ajax({
                            url: ctx + '/app/ad/show2',
                            type: 'POST',
                            dataType: 'json',
                            data: JSON.stringify({
                                lineName: $('#lineNameS option:checked').text(),
                                sNumber: "common"
                            }),
                            contentType: 'application/json;charset=UTF-8',
                            success: function (datas) {
                                if (datas[0]!=null){
                                    $("#infoView1").click(function (){
                                        active.infoView(datas[0].id);
                                        $("#infoView1").unbind("click");
                                    })
                                textTip(datas);
                                // 绘制公共信息
                                var myChart = echarts.init(document.getElementById('main'));
                                myChart.clear();
                                var option;//定义设置项
                                //通过jqeury的get方法获取svg文件，并执行回调函数function (svg){}
                                $.get('/static/1.svg', function (svg) {
                                    echarts.registerMap('Beef_cuts_France', {svg: svg});//注册地图
                                    option = {
                                        title: {
                                            text: datas[0].lineName + '：公共详细信息',
                                            left: 'center'
                                        },
                                        // 鼠标移动至svg元素上会弹出来的提示框
                                        tooltip: {
                                            //可以格式化其显示的内容，可以使用回调函数，详见说明文档
                                            //formatter: '{b}: {c}<br />'
                                            // 使用字符串模板，模板变量为刻度默认标签 {value}
                                            //formatter: '{value}',
                                            // 使用函数模板，函数参数分别为刻度数值（类目），刻度的索引
                                            formatter: function (value, index) {
                                                return value.data.value;
                                            }
                                        },
                                        //对数据列的设置
                                        series: [
                                            {
                                                name: 'French Beef Cuts',//数据列的名称
                                                type: 'map',//数据列的类别
                                                map: 'Beef_cuts_France',//数据列所要绑定的地图
                                                //roam: true,//是否允许放大

                                                label: {
                                                    show: false, //展示
                                                    position: 'outside' // outside表示文本显示位置为外部
                                                },
                                                emphasis: {
                                                    //文本样式
                                                    show: false, //展示
                                                    textStyle: {
                                                        //文本样式
                                                        fontSize: '14',
                                                        fontWeight: '600'
                                                    }
                                                },
                                                labelLine: {
                                                    show: false, //展示
                                                    position: 'outside',
                                                    length: 50
                                                },

                                                //数据列的显示样式
                                                itemStyle: {
                                                    color: 'Yellow',//颜色设置，在我使用的自己绘制的SVG图中，这个设置项可以对svg元素的填充色不起作用
                                                    borderColor: 'rgba(255,255,0,0.1)',//边框颜色设置
                                                    borderWidth: 2,//边框粗细设置
                                                    areaColor: 'rgba(255,0,0,0)',//区域颜色设置，在我使用的自己绘制的SVG图中，这个设置项可以对svg元素的填充色进行设置，前提是svg元素在绘制的时候填充颜色不透明度要大于0
                                                },
                                                //高亮显示的设置
                                                emphasis: {
                                                    //高亮时的样式显示
                                                    itemStyle: {
                                                        borderColor: 'Yellow',
                                                        areaColor: 'rgba(255,0,0,0.5)',
                                                        borderWidth: 2,
                                                        borderType: 'solid'
                                                    }
                                                },
                                                selectedMode: false,//关闭选择模式，即图元为不可选择状态。开启时，同样可以对元素被选中后的样式等进行设置
                                                // 以下为测试数据
                                                //这里的name为svg文件中元素的name属性，很多svg编辑器绘制的svg文件是没有name属性的，必须得自己加上去。
                                                data: [
                                                    {
                                                        name: '门翼',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].GPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].GPartName,
                                                    },
                                                    {
                                                        name: '读写器',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].RPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].RPartName
                                                    },
                                                    {
                                                        name: '磁模块',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].MPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].MPartName
                                                    },
                                                    {
                                                        name: '显示屏',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].DPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].DPartName
                                                    },
                                                    {
                                                        name: '通行控制单元',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].CPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].CPartName
                                                    },
                                                    {
                                                        name: '备用电源',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].EPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].EPartName
                                                    },
                                                    {
                                                        name: '数据存储卡',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].SPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].SPartName
                                                    },
                                                    {
                                                        name: '编码器',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].CoPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].CoPartName
                                                    },
                                                    {
                                                        name: '工控机',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].IpcPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].IpcPartName
                                                    },
                                                    {
                                                        name: '二维码识读',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].QrPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].QrPartName
                                                    },
                                                    {
                                                        name: '摄像头',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].FPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].FPartName
                                                    },
                                                    {
                                                        name: '旅行证件识读',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].TPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].TPartName
                                                    },
                                                    {
                                                        name: '电机驱动器',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].MdPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].MdPartName
                                                    },
                                                    {
                                                        name: '测量光幕',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].MlPartNumber + '<br>'+ '<b>' +"名称："+'</b>' + datas[0].MlPartName
                                                    },
                                                    {
                                                        name: '安全光幕',
                                                        value: '<b>'+"编码："+'</b>' + datas[0].SlPartNumber + '<br>' + '<b>'+"名称："+'</b>' + datas[0].SlPartName
                                                    }
                                                ]
                                            }
                                        ]
                                    };
                                    myChart.setOption(option);
                                });
                                if (option && typeof option === 'object') {
                                    myChart.setOption(option);
                                }
                                window.addEventListener('resize', myChart.resize);
                                myChart.on("mouseover", function (params) {
                                    let name = params.name;
                                    if (name == "门翼") {
                                        $(".one").css("color", "blue");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "读写器") {
                                        $(".one").removeAttr("style");
                                        $(".two").css("color", "blue");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "磁模块") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").css("color", "blue");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "显示屏") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").css("color", "blue");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "通行控制单元") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").css("color", "blue");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "备用电源") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").css("color", "blue");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "数据存储卡") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").css("color", "blue");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "编码器") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").css("color", "blue");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "工控机") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").css("color", "blue");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "二维码识读") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").css("color", "blue");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "摄像头") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").css("color", "blue");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "旅行证件识读") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").css("color", "blue");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "电机驱动器") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").css("color", "blue");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "测量光幕") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").css("color", "blue");
                                        $(".fifteen").removeAttr("style");
                                    } else if (name == "安全光幕") {
                                        $(".one").removeAttr("style");
                                        $(".two").removeAttr("style");
                                        $(".three").removeAttr("style");
                                        $(".four").removeAttr("style");
                                        $(".five").removeAttr("style");
                                        $(".six").removeAttr("style");
                                        $(".seven").removeAttr("style");
                                        $(".eight").removeAttr("style");
                                        $(".nine").removeAttr("style");
                                        $(".ten").removeAttr("style");
                                        $(".eleven").removeAttr("style");
                                        $(".twelve").removeAttr("style");
                                        $(".thirteen").removeAttr("style");
                                        $(".fourteen").removeAttr("style");
                                        $(".fifteen").css("color", "blue");
                                    }
                                })
                                myChart.on("mouseout", function (params) {
                                    $(".one").removeAttr("style");
                                    $(".two").removeAttr("style");
                                    $(".three").removeAttr("style");
                                    $(".four").removeAttr("style");
                                    $(".five").removeAttr("style");
                                    $(".six").removeAttr("style");
                                    $(".seven").removeAttr("style");
                                    $(".eight").removeAttr("style");
                                    $(".nine").removeAttr("style");
                                    $(".ten").removeAttr("style");
                                    $(".eleven").removeAttr("style");
                                    $(".twelve").removeAttr("style");
                                    $(".thirteen").removeAttr("style");
                                    $(".fourteen").removeAttr("style");
                                    $(".fifteen").removeAttr("style");
                                })
                                }else {
                                    $('.left1').empty();
                                    $('.right1').empty();
                                    var myChart = echarts.init(document.getElementById('main'));
                                    myChart.dispose();
                                    layer.msg("无公共数据，请选择详细数据");
                                    //$('#main').append("<p style='text-align: center;margin: 180px;'>"+"无公共数据，请选择详细数据"+"</p>");
                                    $("#infoView1").click(function (){
                                        layer.msg("暂无图片");
                                        $("#infoView1").unbind("click");
                                    })
                                }
                            }
                        });
                        //执行重载2
                        table.reload('userTable1', {
                            where: {
                                "lineName": null,
                                'stationName': null,
                                'location': null
                            }
                        });
                    }, error: function () {
                        layer.msg('没有获取到数据');
                    }
                });
            } else {
                $("#stationNameS").empty();
                $("#locationS").empty();
                //执行重载2
                table.reload('userTable1', {
                    where: {
                        "lineName": $('#lineNameS option:checked').text(),
                        'stationName': null,
                        'location': null
                    }
                });
                form.render();
            }
        });

        //下拉框22监听事件
        form.on('select(stationNameTest)', function (data) {
            if ($('#stationNameS option:checked').val() != 0 && $('#lineNameS option:checked').val() != 0) {
                $.ajax({
                    url: ctx + '/app/ad/pageTest3',
                    type: 'POST',
                    dataType: 'json',
                    data: JSON.stringify({
                        stationName: $('#stationNameS option:checked').text()
                    }),
                    contentType: 'application/json;charset=UTF-8',
                    success: function (data) {
                        let str3 = "<option value='0'>请选择位置</option>";
                        for (let i of data) {
                            str3 += `<option value='${i.location}'>${i.location}</option>`;
                        }
                        $("#locationS").html(str3);
                        //执行重载2
                        table.reload('userTable1', {
                            where: {
                                "lineName": null,
                                'stationName': null,
                                'location': null
                            }
                        });
                        form.render();
                    }, error: function () {
                        layer.msg('没有获取到数据');
                    }
                });
            } else {
                $("#locationS").empty();
                //执行重载2
                table.reload('userTable1', {
                    where: {
                        "lineName": null,
                        'stationName': null,
                        'location': null
                    }
                });
                form.render();
            }
        });

        //下拉框33监听事件
        form.on('select(locationTest)', function (data) {
            if ($('#stationNameS option:checked').val() != 0 && $('#lineNameS option:checked').val() != 0 && $('#locationS option:checked').val() != 0) {
                $.ajax({
                    url: ctx + '/app/ad/pageTest3',
                    type: 'POST',
                    dataType: 'json',
                    data: JSON.stringify({
                        location: $('#locationS option:checked').text()
                    }),
                    contentType: 'application/json;charset=UTF-8',
                    success: function (data) {
                        //执行重载2
                        table.reload('userTable1', {
                            where: {
                                "lineName": $('#lineNameS option:checked').text(),
                                "stationName": $('#stationNameS option:checked').text(),
                                "location": $('#locationS option:checked').text()
                            }
                        });
                        form.render();
                    }, error: function () {
                        layer.msg('没有获取到数据');
                    }
                });
            } else {
                $("#locationS").empty();
                //执行重载2
                table.reload('userTable1', {
                    where: {
                        "lineName": null,
                        'stationName': null,
                        'location': null
                    }
                });
                form.render();
            }
        });

        /* 触发弹层 */
        let active = {
            /**
             * 添加3
             * */
            addSite: function () {
                layer.open({
                    type: 2
                    , shade: 0.3
                    , title: "添加信息"
                    , content: ctx + '/app/user/addPage3'
                    , maxmin: true
                    , scrollbar: false
                    , area: ['100%', '100%']
                    , btn: ['确定', '取消']
                    , yes: function (index, layero) {
                        let submit = layero.find('iframe').contents().find('#save-submit');
                        submit.trigger('click');
                    }
                });
            },
            /**
             * 添加2
             * */
            addView2: function () {
                layer.open({
                    type: 2
                    , shade: 0.3
                    , title: "添加信息"
                    , content: ctx + '/app/user/addPage2'
                    , maxmin: true
                    , scrollbar: false
                    , area: ['100%', '100%']
                    , btn: ['确定', '取消']
                    , yes: function (index, layero) {
                        let submit = layero.find('iframe').contents().find('#save-submit');
                        submit.trigger('click');
                    }
                });
            },
            /**
             * 添加
             * */
            addView: function () {
                layer.open({
                    type: 2
                    , shade: 0.3
                    , title: "添加信息"
                    , content: ctx + '/app/user/addPage'
                    , maxmin: true
                    , scrollbar: false
                    , area: ['100%', '100%']
                    , btn: ['确定', '取消']
                    , yes: function (index, layero) {
                        let submit = layero.find('iframe').contents().find('#save-submit');
                        submit.trigger('click');
                    }
                });
            },
            /**
             * 编辑
             * @param id id
             * */
            editView: function (id) {
                layer.open({
                    type: 2
                    , shade: 0.3
                    , title: '修改信息'
                    , content: ctx + '/app/user/editPage/' + id
                    , maxmin: true
                    , scrollbar: false
                    , area: ['100%', '100%']
                    , btn: ['确定', '取消']
                    , yes: function (index, layero) {
                        let submit = layero.find('iframe').contents().find('#save-submit');
                        submit.trigger('click');
                    }
                });
            },
            /**
             * 删除
             * @param id id
             */
            del: function (id) {
                layer.confirm('是否确认删除', function (index) {
                    //向服务端发送删除指令
                    $.ajax({
                        type: 'DELETE',
                        url: ctx + '/app/user/remove/' + id,
                        contentType: 'application/json;charset=UTF-8',
                        dataType: 'json',
                        async: false,
                        success: function (result) {
                            layer.msg(result.message);
                            if (result.code === 200) {
                                layer.close(index);
                                // table.reload('adTable');
                            }
                        }
                    });
                });
            },
            /**
             * 信息详情
             * @param id id
             * */
            infoView: function (id) {
                layer.open({
                    type: 2
                    , shade: 0.3
                    , title: '查看详情'
                    , content: ctx + '/app/ad/infoPage2/' + id
                    , maxmin: true
                    , scrollbar: false
                    , area: ['100%', '100%']
                    , btn: ['关闭']
                    , yes: function (index, layero) {
                        layer.closeAll();
                    }
                });
            }
        }
    })
    ;
</script>
</body>
</html>
